<template>
  <div class="mod-config">
    <el-form :inline="true" ref="searchForm" :model="dataForm">
      <el-form-item label="查询角度" prop="checkPoint">
        <el-radio-group v-model="dataForm.checkPoint">
          <el-radio :label="1">按营业员汇总</el-radio>
          <el-radio :label="2">按收银员汇总 </el-radio>
          <el-radio :label="3">按验光师汇总</el-radio>
          <el-radio :label="4">按门店汇总</el-radio>
          <el-radio :label="5">按加工师汇总（加工师加工人员） </el-radio>
          <el-radio :label="6">按取镜人员汇总</el-radio>
        </el-radio-group>
      </el-form-item>
      <el-row>
        <el-form-item label="所属公司">
          <el-select style="width: 175px;" v-model="dataForm.unitId" @change="unitChangeHandle">
            <el-option v-for="item in companyOption" :value="item.id" :label="item.name" :key='item.id'></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="查询部门">
          <el-select style="width: 175px;" v-model="dataForm.deptId">
            <el-option v-for="item in deptOption" :value="item.id" :label="item.name" :key='item.id'></el-option>
          </el-select>
        </el-form-item>
        <el-form-item label="评价年份">
          <el-date-picker v-model="dataForm.evaluationYear" class="timePicker" type="month" placeholder="选择年份" format="yyyy" value-format="yyyy">
          </el-date-picker>
        </el-form-item>
        <el-form-item label="评价人">
          <el-input v-model="dataForm.personName"></el-input>
        </el-form-item>
        <el-form-item>
          <el-button type="primary" icon="el-icon-search" @click="searchChange">查询</el-button>
          <el-button type="default" icon="el-icon-delete" @click="searchReset">清空</el-button>
        </el-form-item>
      </el-row>
    </el-form>
    <div class="avue-crud">
      <el-table :data="dataList" border v-loading="dataListLoading">
        <el-table-column prop="personName" label="评价人"></el-table-column>
        <el-table-column prop="evaluationYear" label="评价年份"></el-table-column>
        <el-table-column prop="saleBillId" label="销售单号"></el-table-column>
        <el-table-column label="操作">
          <template slot-scope="scope">
            <el-button type="text" icon="el-icon-edit" @click="checkDetail(scope.row.id)">详情</el-button>
          </template>
        </el-table-column>
      </el-table>
    </div>

    <div class="avue-crud__pagination">
      <el-pagination @size-change="sizeChangeHandle" @current-change="currentChangeHandle" :current-page="pageIndex" :page-sizes="[10, 20, 50, 100]" :page-size="pageSize" :total="totalPage" background layout="total, sizes, prev, pager, next">
      </el-pagination>
    </div>
    <assess-log v-if="logVisible" ref="logDialog"></assess-log>
  </div>
</template>

<script>
  import { mapGetters } from 'vuex'
  import {
    fetchWxEvaluationLogList,
    getAssessData
  } from '@/api/mp/wxevaluationlog'

  import AssessLog from './AssessLogForm'
  import { filterParams } from '@/util/tools'

  export default {
    data() {
      return {
        dataForm: {
          personName: ''
        },
        companyOption: [],
        deptOption: [],
        dataList: [],
        searchShow: true,
        pageIndex: 1,
        pageSize: 10,
        totalPage: 0,
        dataListLoading: false,
        logVisible: false
      }
    },
    components: {
      AssessLog
    },
    computed: {
      ...mapGetters(['permissions'])
    },
    methods: {
      init() {
        this.getDataList()
      },
      // 获取数据列表
      getDataList() {
        this.dataListLoading = true
        let params1 = {
          current: this.pageIndex,
          size: this.pageSize
        }
        let params2 = filterParams(this.dataForm)
        fetchWxEvaluationLogList(Object.assign(params1, params2)).then(response => {
          this.dataList = response.data.data.records
          this.totalPage = response.data.data.total
        })
        this.dataListLoading = false
      },
      // 每页数
      sizeChangeHandle(val) {
        this.pageSize = val
        this.pageIndex = 1
        this.getDataList()
      },
      // 当前页
      currentChangeHandle(val) {
        this.pageIndex = val
        this.getDataList()
      },
      // 查看记录详情
      checkDetail(id) {
        this.logVisible = true
        this.$nextTick(() => {
          this.$refs.logDialog.init(id)
        })
      },
      searchChange() {
        this.pageIndex = 1;
        this.getDataList()
      },
      // 搜索清空
      searchReset() {
        for (let key in this.dataForm) {
          this.dataForm[key] = "";
        }
        this.getDataList(this.page)
      }
    }
  }
</script>

<style>
</style>
